import React, { Component } from 'react';
import { Form, Input, Modal, Select } from 'antd';
const FormItem = Form.Item;
const Option = Select.Option;

class FeedbackModal extends Component {
  constructor(props) {
    super(props);
    this.state = {
      typeHelp: ''
    }
  }

  handleTypeChange = (value) => {
    let msg;
    switch (value) {
      case '0':
        msg = '吐槽部长、吐槽中心...不吐不快，尽情吐槽吧';
        break;
      case '1':
        msg = '遇到什么Bug了？有漏洞？反馈有奖哦';
        break;
      case '2':
        msg = '有什么突发奇想？脑洞是要有的，万一实现了呢';
        break;
    }
    if (msg) {
      this.setState({ typeHelp: msg });
    }
  }

  render() {
    const { form, handleCancel, onFeedback, visible } = this.props;
    const { getFieldDecorator } = form;
    return(
      <Modal
        visible={visible}
        title="吐槽/意见"
        okText="提交"
        onCancel={handleCancel}
        onOk={onFeedback}
      >
        <Form layout="horizontal">

          <FormItem label="类型" help={this.state.typeHelp}>
            {getFieldDecorator('type', {
              rules: [{ required: true, message: '选择类型'}],
            })(
              <Select onChange={this.handleTypeChange}>
                {
                  OAglobal.feedbackType.map(function(item) {
                    return <Option key={item.key} value={item.key}>{item.text}</Option>
                  })
                }
              </Select>
            )}
          </FormItem>

          <FormItem label="内容">
            {getFieldDecorator('content', {
              rules: [{ required: true, message: '不写点什么吗？' }],
            })(
              <Input type="textarea" autosize={{minRows: 6}} />
            )}
          </FormItem>

        </Form>
      </Modal>
    );
  }
}

const FeedbackModalForm = Form.create()(FeedbackModal);

export default FeedbackModalForm;